<template>
  <el-dialog
    v-model="isShow"
    :title="title +'-'+ nickname"
    width="640"
    :close-on-click-modal="false"
    @close="handleClose"
  >
  <el-form class="dialog-form" label-width="120px">
      <el-row :gutter="20">
        <el-col :xs="24">
          <el-form-item label="是否会员：">
            <el-radio-group v-model="form.isMembers">
              <el-radio :label="'0'">否</el-radio>
              <el-radio :label="'1'">是</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :xs="24" v-if="form.isMembers == '1'">
          <el-form-item label="会员到期日：">
            <el-date-picker
                v-model="form.membersDate"
                type="date"
                value-format="YYYY-MM-DD"
                placeholder="选择"
              />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="isShow = false">取消</el-button>
        <el-button type="primary" :loading="btnLoading" @click="toSubmit">确定</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import {dayjs} from 'element-plus';
import {ElMessage, ElMessageBox} from 'element-plus'
import { ref, reactive, inject, getCurrentInstance, ComponentInternalInstance } from 'vue';
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
let optionData:any = inject('optionData'); 
const emit = defineEmits(['confirm']);
let isShow = ref(false);
let btnLoading= ref(false);
let title = ref('修改用户会员信息');
let nickname = ref();
let form = ref({});
const init = (row:any) => {
  nickname.value = row.nickname;
  isShow.value = true;
  proxy.$request('get', '/admin/appuser/details/' + row.userId, {}, (data,msg) => {
    form.value = data;
  })
  
};
const handleClose = () => {
  nickname.value = null;
  form.value.userId = null;
  form.value.isMembers = '0';
  form.value.membersDate = '';
  form.value = {};
};
const verifyForm = () => {
  if(form.value.isMembers == '0'){
    if(form.value.membersDate){
      form.value.membersDate = dayjs().format('YYYY-MM-DD');
    }
  }else{
    if(form.value.membersDate){
      let b = dayjs(form.value.membersDate).isBefore(dayjs());
      if(b){
        ElMessage.warning('会员日期不能小于今天');
        return false;
      }
    }else{
      ElMessage.warning('请选项会员到期日期');
      return false;
    }
  }
  return true;
};
const toSubmit = () => {
  if(!verifyForm()){  
      return;
  }
  btnLoading.value = true;
  proxy.$request('put', '/admin/appuser', form.value, (data,msg) => {
    ElMessage.success('修改成功');
    btnLoading.value = false;
    isShow.value = false;
    emit('confirm');
  }, msg => {
    btnLoading.value = false;
  })
}

defineExpose({
  init,
})
</script>

<style>

</style>